<div class="layui-fluid nepadmin-pad0 nepadmin-mar0 list0" lay-title="模块管理">
	<div class="layui-fluid">
		<div class="layui-row layui-col-space15">
			<div class="layui-col-md12">
				<div class="layui-card hxr-layui-card">
					<div class="layui-card-body" id="list">
						<div style="padding: 0 0 5px;">
							<!-- <button class="layui-btn layuiadmin-btn-list" data-type="batchdel">删除</button> -->
							<button class="layui-btn layuiadmin-btn-list add">添加</button>
						</div>
						<!-- <table class="layui-table">
						  <thead>
						    <tr>
						      <th>ID</th>
						      <th>模块名称</th>
							  <th>模块类型</th>
							  <th>操作</th>
						    </tr> 
						  </thead>
						  <tbody>
							 <template v-for="x in list">
								<tr v-if="x.level==1">
									<td>{{x.module_id}}</td>
									<td>{{x.module_name}}</td>
									<td>一级菜单</td>
									<td>
										<a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="edit" @click="edit(x)"><i class="layui-icon layui-icon-edit"></i>编辑</a>
									  <a class="layui-btn layui-btn-danger layui-btn-xs" @click="del(x)"><i class="layui-icon layui-icon-delete"></i>删除</a>
									</td>
								</tr>
								<template v-for="y in x.child" v-if="x.child">
									<tr v-if="y.level==2">
										<td>{{y.module_id}}</td>
										<td>----{{y.module_name}}</td>
										<td>二级菜单</td>
										<td>
											<a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="edit" @click="edit(y)"><i class="layui-icon layui-icon-edit"></i>编辑</a>
										  <a class="layui-btn layui-btn-danger layui-btn-xs" @click="del(y)"><i class="layui-icon layui-icon-delete"></i>删除</a>
										</td>
									</tr>
									<tr v-for="k in y.child" v-if="y.child">
										<td>{{k.module_id}}</td>
										<td>----------{{k.module_name}}</td>
										<td>菜单权限</td>
										<td>
										  <a class="layui-btn layui-btn-danger layui-btn-xs" @click="del(k)"><i class="layui-icon layui-icon-delete"></i>删除</a>
										</td>
									</tr>
								</template>
							</template>
						  </tbody>
						</table> -->
						<table id="module-table"></table>
						
					</div>
				</div>
			</div>
			<!-- 表格操作列 -->
			<div id="list-toolbar" style="display: none;">
			    <a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="edit"><i class="layui-icon layui-icon-edit"></i>编辑</a>
			    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del"><i class="layui-icon layui-icon-delete"></i>删除</a>
			</div>
			
			<!-- 表格状态列 -->
			<!-- <script type="text/html" id="status">
			    <input type="checkbox" lay-filter="status" value="{{d.is_display}}" lay-skin="switch"
			           lay-text="是|否" data-json="{{ encodeURIComponent(JSON.stringify(d)) }}" {{d.is_display==1?'checked':''}}/>
			</script> -->
			<script type="text/html" id="level">
				{{#  if(d.level === 1){ }}
							一级菜单
				{{#  } else if(d.level === 2) { }}
				  二级菜单
				  {{#  } else if(d.level === 3) { }}
				    菜单权限
				{{#  } }}
			</script>
		</div>
	</div>
</div>
<script>
	layui.use(['treeTable'], function () {
			var treeTable = layui.treeTable,$=layui.$;
			// 渲染表格
			layui.admin.ajax('menu/list',{},1).then(function(res){
				var menu=res.data.list,menus=[];
				for(var i=0; i<menu.length; i++){
					menu[i].id=menu[i].module_id;
					if(menu[i].level===1){
						menu[i].open=true;
						menus.push(menu[i]);
					}
				}
				for(var i=0; i<menu.length; i++){
					for(var j=0; j<menus.length; j++){
						if(menu[i].pid==menus[j].module_id){
							if(!menus[j].children)menus[j].children=[];
							menus[j].children.push(menu[i]);
						}
					}
				}
				for(var i=0; i<menu.length; i++){
					for(var j=0; j<menus.length; j++){
						if(menus[j].children){
							for(var k=0; k<menus[j].children.length; k++){
								if(menu[i].pid==menus[j].children[k].module_id){
									if(!menus[j].children[k].children)menus[j].children[k].children=[];
									menus[j].children[k].children.push(menu[i]);
								}
							}
						}
					}
				}
				// 渲染表格
				var insTb = treeTable.render({
					elem: '#module-table',
					data: menus,
					tree: {
						iconIndex: 1
					},
					cols: [
						{type: 'numbers'},
						{field: 'module_name', title: '模块名称'},
						{templet: '#level', title: '模块等级', width: 100},
						//{field: 'is_display',templet: '#status', title: '是否显示', width: 100},
						{align: 'center', toolbar: '#list-toolbar', title: '操作', width: 150}
					],
					style: 'margin-top:0;'
				});
				$('.add').click(function(){
					layui.admin.pupF('添加模块',['500px', '550px'],'system/moudleform',1,{});
					layui.admin.module=menus;
				});
				//监听表格操作事件
				treeTable.on('tool(module-table)', function(obj){
				  var data = obj.data;
				  //删除
				  if(obj.event === 'del'){
					layer.confirm('确定删除'+data.module_name+'？', function(index) {
						layui.admin.ajax('menu/delete',{
							module_id:data.module_id
						}).then(function(){
							layui.view.tab.refresh('/system/moudle');
						});
					});
				  } else if(obj.event === 'edit'){//编辑
					layui.admin.module=menus;
					layui.admin.pupF('编辑模块',['500px', '500px'],'system/moudleform',2,data);
				  }
				});
			});
			//监听表格表单操作
			layui.form.on('switch(status)', function(obj){
			  var json = JSON.parse(decodeURIComponent($(this).data('json')));

			  layui.admin.ajax('menu/update',{
				  is_display:json.is_display==1?0:1,
				  module_id:json.module_id
			  }).then(function(res){
				layui.table.reload('module-table');
			  }).catch(function(res){});
			});
			
		})
	
</script>
